import React, { Component } from 'react';
import router from 'umi/router';
import { connect } from 'dva';
import { DatePicker, List } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import GroupMonitoring from './components/GroupMonitoring';
import ContentIndex from './components/ContentIndex';
import styles from './index.less';

@connect(state => ({
  allProjectIndexUsingItems: state.Workbench.allProjectIndexUsingItems, // 工作台 全部指标数据
  porjectStagePageList: state.Workbench.porjectStagePageList, // 项目概览
}))
class workbench extends Component {
  state = {
    loading: true,
  };

  componentDidMount() {
    const { dispatch } = this.props;
    const params = {
      current: '1',
      pageSize: '6',
      projectName: '',
    };
    const sefl = this;
    dispatch({
      type: 'Workbench/requestProjectStagePageList',
      payload: {
        params,
      },
      callback: data => {
        sefl.setState({
          loading: false,
        });
        if (data.data.length > 0 && data.data.length < 2) {
          router.push({
            pathname: '/Workbench/projectWorkbench',
            query: {
              projectName: escape(data.data[0].projectName),
              projectId: data.data[0].projectId,
            },
          });
        }
      },
    });
    dispatch({
      type: 'Workbench/init',
      payload: {},
    });
  }

  render() {
    return (
      <div className={styles.workbench}>
        <div className="all">
          <PageHeaderWrapper breadcrumb={null} title="全部项目">
            <GroupMonitoring {...this.props} />
            <ContentIndex {...this.props} l={this.state.loading} />
          </PageHeaderWrapper>
        </div>
      </div>
    );
  }
}

export default workbench;
